// grunt的入口文件
// 用于定义一些需要grunt自动执行的任务
// 需要导出一个函数

// grunt-sass依赖 sass
const sass = require('sass')
// 自动加载所有的grunt插件中的任务
const loadGruntTasks = require('load-grunt-tasks')
// 此函数接收一个grunt的形参，内部提供一些创建任务时可以用到的API
// 使用 yarn grunt foo 就会调用下面的foo任务
module.exports = grunt => {
    grunt.initConfig({
        pkg: grunt.file.readJSON('package.json'),
        sass: {
            options: {
                // 用来指定在执行sass任务当中使用那个模块去编译，这里用sass包
                implementation: sass,
                sourceMap: true
            },
            main: {
                files: {
                    // 键是sass转成css后的路径，值是sass源文件的路径
                    'dist/assets/styles/main.scss': 'src/assets/styles/main.scss',
                    'dist/assets/styles/_variables.scss': 'src/assets/styles/_variables.scss',
                    'dist/assets/styles/_icons.scss': 'src/assets/styles/_icons.scss',
                }
            }
        },
        babel: {
            options: {
                // 把es6最新的特性加载进来
                presets: ['@babel/preset-env'],
                sourceMap: true
            },
            main: {
                files: {
                    // 键是es6转成js后的路径，值是es6源文件的路径
                    'dist/assets/scripts/main.js': 'src/assets/scripts/main.js',
                }
            }
        },
        watch: {
            js: {
                files: ['src/assets/scripts/main.js'],
                // 当文件发生改变后需要执行什么任务
                tasks: ['babel']
            },
            css: {
                files: ['src/assets/styles/main.scss'],
                // 当文件发生改变后需要执行什么任务
                tasks: ['sass']
            }
        },
        clean: {
            dist: 'dist'
        }
    })
    loadGruntTasks(grunt) // 自动加载所有的grunt插件中的任务
    // 这时候执行yarn grunt就会依次调用 foo bar
    grunt.registerTask('default', ['sass','babel','watch'])
}
